import React from "react";
import { HashRouter, Route, Switch, Redirect } from "react-router-dom";

import App from "./appWrap";

import Login from "./pages/login";
import Admin from "./pages/admin";
import Home from "./pages/home";
import NoMatch from "./pages/noMatch";
import UIButton from "./pages/ui/button";
import UIGallery from "./pages/ui/gallery";
import UILoading from "./pages/ui/loading";
import UIMessage from "./pages/ui/message";
import UIModal from "./pages/ui/modal";
import UINotice from "./pages/ui/notice";
import UITab from "./pages/ui/tab";
import LoginForm from "./pages/form/login";
import RegisterForm from "./pages/form/register";
import TestForm from "./pages/form/test";
import SubTestForm from "./pages/form/subFormTest";
import TestHightForm from "./pages/form/hightForm";
import TestTableForm from "./pages/form/table";
import TestTableForm2 from "./pages/form/table2";
import FatherAndSon from "./pages/form/fatherAndSon";
import BaseTable from "./pages/table/base";
import HighTable from "./pages/table/high";
import CityPage from "./pages/city";
import OrderPage from "./pages/order";
import EChartBarPage from "./pages/echarts/bar";
import EChartPiePage from "./pages/echarts/pie";
import EChartLinePage from "./pages/echarts/line";
import TestDB from "./pages/testDB";
import ReduxTest from "./pages/redux-test";

const Routers: React.FC = () => (
	<HashRouter>
		<App>
			<Switch>
				<Route path="/login" component={Login}></Route>
				<Route
					path="/admin"
					render={() => (
						<Admin>
							<Switch>
								<Route path="/admin/home" component={Home}></Route>
								<Route path="/admin/ui/button" component={UIButton}></Route>
								<Route path="/admin/ui/gallery" component={UIGallery}></Route>
								<Route path="/admin/ui/loading" component={UILoading}></Route>
								<Route path="/admin/ui/message" component={UIMessage}></Route>
								<Route path="/admin/ui/modal" component={UIModal}></Route>
								<Route path="/admin/ui/notice" component={UINotice}></Route>
								<Route path="/admin/ui/tab" component={UITab}></Route>
								<Route path="/admin/form/login" component={LoginForm}></Route>
								<Route path="/admin/form/register" component={RegisterForm}></Route>
								<Route path="/admin/form/testForm" component={TestForm}></Route>
								<Route path="/admin/form/subTestForm" component={SubTestForm}></Route>
								<Route path="/admin/form/testHightForm" component={TestHightForm}></Route>
								<Route path="/admin/form/testTableForm" component={TestTableForm}></Route>
								<Route path="/admin/form/testTableForm2" component={TestTableForm2}></Route>
								<Route path="/admin/form/fatherAndSon" component={FatherAndSon}></Route>
								<Route path="/admin/Table/base" component={BaseTable}></Route>
								<Route path="/admin/Table/high" component={HighTable}></Route>
								<Route path="/admin/city" component={CityPage}></Route>
								<Route path="/admin/order" component={OrderPage}></Route>
								<Route path="/admin/ECharts/bar" component={EChartBarPage}></Route>
								<Route path="/admin/ECharts/pie" component={EChartPiePage}></Route>
								<Route path="/admin/ECharts/line" component={EChartLinePage}></Route>
								<Route path="/admin/testDB" component={TestDB}></Route>
								<Route path="/admin/reduxTest" component={ReduxTest}></Route>
								<Route component={NoMatch}></Route>
							</Switch>
						</Admin>
					)}
				></Route>

				<Redirect to="/admin/home" />
			</Switch>
		</App>
	</HashRouter>
);

export default Routers;
